import 'dart:ui';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'dart:math';


///  自定义 密码输入框
 
class CustomPassword extends StatelessWidget {

  ///  传入当前密码
  String data;
  CustomPassword(this.data);

  @override
  Widget build(BuildContext context) {
    return CustomPaint(
      painter: MyCustom(data),
    );
  }
}

class MyCustom extends CustomPainter {

  TextPainter textPainter;
  String pwdLength;
  MyCustom(this.pwdLength){
    textPainter = TextPainter(
      textAlign: TextAlign.center,
      textDirection: TextDirection.rtl,
    );
  }


  @override
  void paint(Canvas canvas, Size size) {
    // print(pwdLength);
    int PWD_SPACING = 5;
    int PWD_SIZE = 5;
    int mWidth;

    // 密码长度
    int PWD_LENGTH = 4;

    // 密码画笔
    Paint mPwdPaint;
    Paint mRectPaint;
    Rect mRect;
    int mInputLength;


    // 初始化密码画笔  
    mPwdPaint = new Paint();
    mPwdPaint..color = Colors.black;

//   mPwdPaint.setAntiAlias(true);
    // 初始化密码框  
    mRectPaint = new Paint();
    mRectPaint.color = Color(0xff707070);


    // RRect r = new RRect.fromLTRBR(
    //     0.0, 0.0, size.width, size.height, new Radius.circular(size.height / 12));
    // mRectPaint.style = PaintingStyle.stroke;
    // canvas.drawRRect(r, mRectPaint);


    // var per = size.width / 4.0;
    var offsetY = 0.0;
    var mid = 28.0;
    var per = (size.width - (mid*3))/4;
    // var offsetX = per;
    // while (offsetX < size.width) {
    //   canvas.drawLine(
    //       new Offset(offsetX, 0.0), new Offset(offsetX, size.height), mRectPaint);
    //   offsetX += per;
    // }
    while (offsetY < size.width) {
      canvas.drawLine(Offset(offsetY,size.height), Offset(offsetY+per,size.height,), mRectPaint);
      offsetY = offsetY + per + mid;
    }
    canvas.save();
    var half = per/2;
    var radio = per/8;
    // TextPainter
    // canvas.
    // mPwdPaint.style = PaintingStyle.fill;
    for(int i =0; i< pwdLength.length && i< 4; i++){
      // canvas.drawArc(new Rect.fromLTRB(i*per+half-radio, size.height/2-radio, i*per+half+radio, size.height/2+radio), 0.0, 2*pi, true, mPwdPaint);
      // print(pwdLength[i]);
      // print(i);
      textPainter.text = TextSpan(
        text: pwdLength[i],
        style: TextStyle(
              color: Color(0xFF424D59),
              // fontFamily: 'Times New Roman',
              fontSize: 28.0,
            ),
      );
      textPainter.layout();
      textPainter.paint(canvas, Offset(-(textPainter.width / 2) + i*per +per/2 + i*mid, -(textPainter.height / 2)));
      
    }
    canvas.restore();
  }

  @override
  bool shouldRepaint(CustomPainter oldDelegate) {
    return true;
  }

}